<!-- 备料推荐批次详情 -->
<template>
  <el-dialog
    custom-class="lotNoDialog"
    append-to-body
    :close-on-click-modal="false"
    title="备料推荐批次详情"
    :visible.sync="lotNoDialog.visible"
    v-if="lotNoDialog.visible"
    width="80%"
    top="7vh"
    @close="close()"
  >
    <avue-form v-model="lotNoHeaderForm" :option="lotNoHeaderOption"></avue-form>
    <div class="gap"></div>
    <avue-crud :option="lotNoDialog.option" :table-loading="lotNoDialog.loading" :data="lotNoDialog.data" v-model="lotNoDialog.form" ref="packBoxTableCrud"> </avue-crud>
  </el-dialog>
</template>

<script>
import { getPackBoxDetail } from '@/api/warehouse/preMaterialList';

export default {
  name: 'lotNoDialog',
  components: {},
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      lotNoHeaderForm: {
        partNo: '',
        partName: '',
        partModel: '',
        originalQtyTotal: '',
        quantity: ''
      },
      lotNoHeaderOption: {
        submitBtn: false,
        emptyBtn: false,
        detail: true,
        column: [
          {
            label: '物料编码',
            span: 8,
            prop: 'partNo'
          },
          {
            label: '物料名称',
            span: 8,
            prop: 'partName'
          },
          {
            label: '物料型号',
            span: 8,
            prop: 'partModel'
          },
          {
            label: '需求数量',
            prop: 'originalQtyTotal',
            span: 8
          },
          {
            label: '应发数量',
            span: 8,
            prop: 'quantity'
          }
        ]
      },
      lotNoDialog: {
        visible: false,
        loading: false,
        data: [],
        form: {},
        option: {
          tip: false,
          searchShow: true,
          searchSpan: 4,
          searchMenuSpan: 6,
          dialogClickModal: false,
          height: '400',
          border: true,
          addBtn: false,
          editBtn: false,
          viewBtn: false,
          cancelBtn: false,
          saveBtn: false,
          selection: false,
          menu: false,
          page: false,
          index: true,
          indexLabel: '序号',
          refreshBtn: false,
          expandBtn: false,
          columnBtn: false,
          column: [
            {
              label: '仓库',
              prop: 'recommendInventoryCode'
            },
            {
              label: '储位',
              prop: 'recommendAreaCode'
            },
            {
              label: '推荐批次',
              prop: 'recommendLotNo'
            },
            {
              label: '推荐批次数量',
              prop: 'recommendLotQuantity'
            }
          ]
        }
      }
    };
  },
  watch: {
    visible: {
      handler(value) {
        this.lotNoDialog.visible = value;
      }
    }
  },
  methods: {
    getData(id) {
      this.lotNoDialog.loading = true;
      getPackBoxDetail(id).then((res) => {
        this.lotNoDialog.data = data;
        this.lotNoDialog.loading = false;
      });
    },
    setFormHeader(data) {
      this.lotNoHeaderForm = structuredClone(data);
    },
    close() {
      this.lotNoDialog.visible = false;
      this.$emit('closeDialog');
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep .lotNoDialog {
  .avue-crud__menu {
    display: none;
  }
  .ruleRowForm {
    margin-bottom: 5px;
    .el-radio {
      margin-right: 10px;
    }
    .header-icon {
      margin-right: 10px;
    }
  }
  .gap {
    margin: 15px 0;
  }
}
</style>
